<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>模板</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--====== Favicon Icon ======-->
    <link rel="shortcut icon" href="assets/images/favicon.png" type="image/png">
    <!--====== Magnific Popup CSS ======-->
    <link rel="stylesheet" href="assets/css/magnific-popup.css">
    <!--====== Slick CSS ======-->
    <link rel="stylesheet" href="assets/css/slick.css">
    <!--====== Line Icons CSS ======-->
    <link rel="stylesheet" href="assets/css/LineIcons.css">
    <!--====== Bootstrap CSS ======-->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <!--====== Default CSS ======-->
    <link rel="stylesheet" href="assets/css/default.css">
    <!--====== Style CSS ======-->
    <link rel="stylesheet" href="assets/css/style.css">

</head>
<body>
<!-- 导入页眉 -->
<div class="header"></div>

<!--====== 自定义代码开始 ======-->
<section id="about" class="about-area">
    <div class="container" id="div_vue">
        <!--====== 从这里开始 ======-->
        <div class="row  col-sm-6 offset-md-3"
             style="margin-top: 5%;margin-bottom:3.68%; border-style: solid;border-color: deepskyblue;border-radius: 30px;padding-top: 2%;">
            <!--<div class="row">-->
            <form>
                <div class="row col-sm-10 offset-md-5">
                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"
                         class="bi bi-tools" viewBox="0 0 16 16">
                        <path fill-rule="evenodd"
                              d="M0 1l1-1 3.081 2.2a1 1 0 0 1 .419.815v.07a1 1 0 0 0 .293.708L10.5 9.5l.914-.305a1 1 0 0 1 1.023.242l3.356 3.356a1 1 0 0 1 0 1.414l-1.586 1.586a1 1 0 0 1-1.414 0l-3.356-3.356a1 1 0 0 1-.242-1.023L9.5 10.5 3.793 4.793a1 1 0 0 0-.707-.293h-.071a1 1 0 0 1-.814-.419L0 1zm11.354 9.646a.5.5 0 0 0-.708.708l3 3a.5.5 0 0 0 .708-.708l-3-3z"/>
                        <path fill-rule="evenodd"
                              d="M15.898 2.223a3.003 3.003 0 0 1-3.679 3.674L5.878 12.15a3 3 0 1 1-2.027-2.027l6.252-6.341A3 3 0 0 1 13.778.1l-2.142 2.142L12 4l1.757.364 2.141-2.141zm-13.37 9.019L3.001 11l.471.242.529.026.287.445.445.287.026.529L5 13l-.242.471-.026.529-.445.287-.287.445-.529.026L3 15l-.471-.242L2 14.732l-.287-.445L1.268 14l-.026-.529L1 13l.242-.471.026-.529.445-.287.287-.445.529-.026z"/>
                    </svg>
                    输入新密码 <input type="text" class="form-control" id="newPassword" name="newpassWord"
                                 placeholder="请输入新密码">
                </div>
                <div class="row col-sm-10 offset-md-5">
                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"
                         class="bi bi-tools" viewBox="0 0 16 16">
                        <path fill-rule="evenodd"
                              d="M0 1l1-1 3.081 2.2a1 1 0 0 1 .419.815v.07a1 1 0 0 0 .293.708L10.5 9.5l.914-.305a1 1 0 0 1 1.023.242l3.356 3.356a1 1 0 0 1 0 1.414l-1.586 1.586a1 1 0 0 1-1.414 0l-3.356-3.356a1 1 0 0 1-.242-1.023L9.5 10.5 3.793 4.793a1 1 0 0 0-.707-.293h-.071a1 1 0 0 1-.814-.419L0 1zm11.354 9.646a.5.5 0 0 0-.708.708l3 3a.5.5 0 0 0 .708-.708l-3-3z"/>
                        <path fill-rule="evenodd"
                              d="M15.898 2.223a3.003 3.003 0 0 1-3.679 3.674L5.878 12.15a3 3 0 1 1-2.027-2.027l6.252-6.341A3 3 0 0 1 13.778.1l-2.142 2.142L12 4l1.757.364 2.141-2.141zm-13.37 9.019L3.001 11l.471.242.529.026.287.445.445.287.026.529L5 13l-.242.471-.026.529-.445.287-.287.445-.529.026L3 15l-.471-.242L2 14.732l-.287-.445L1.268 14l-.026-.529L1 13l.242-.471.026-.529.445-.287.287-.445.529-.026z"/>
                    </svg>
                    确认新密码 <input type="text" class="form-control" id="passwordAgain" name="newpassWord1"
                                 placeholder="再次确认新密码">
                </div>
                <hr/>
                <input type="button" class="btn btn-primary"
                       style="margin-left:65%;margin-bottom: 5px" test="qqqq" v-on:click="updatePassword" value="提交">
            </form>
            <!--</div>-->
        </div>
        <div class="row  col-sm-6 offset-md-3"
             style="margin-bottom:10%; border-style: solid;border-color: deepskyblue;border-radius: 30px;padding-top: 2%;">
            <!--<div class="row">-->
            <form>
                <div class="row col-sm-10 offset-md-5">
                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"
                         class="bi bi-envelope" viewBox="0 0 16 16">
                        <path fill-rule="evenodd"
                              d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2zm13 2.383l-4.758 2.855L15 11.114v-5.73zm-.034 6.878L9.271 8.82 8 9.583 6.728 8.82l-5.694 3.44A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.739zM1 11.114l4.758-2.876L1 5.383v5.73z"/>
                    </svg>
                    修改邮箱 <input type="email" class="form-control" id="modifyEmail" placeholder="请输入新邮箱">
                </div>
                <div class="row col-sm-10 offset-md-5">
                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"
                         class="bi bi-telephone" viewBox="0 0 16 16">
                        <path fill-rule="evenodd"
                              d="M3.654 1.328a.678.678 0 0 0-1.015-.063L1.605 2.3c-.483.484-.661 1.169-.45 1.77a17.568 17.568 0 0 0 4.168 6.608 17.569 17.569 0 0 0 6.608 4.168c.601.211 1.286.033 1.77-.45l1.034-1.034a.678.678 0 0 0-.063-1.015l-2.307-1.794a.678.678 0 0 0-.58-.122l-2.19.547a1.745 1.745 0 0 1-1.657-.459L5.482 8.062a1.745 1.745 0 0 1-.46-1.657l.548-2.19a.678.678 0 0 0-.122-.58L3.654 1.328zM1.884.511a1.745 1.745 0 0 1 2.612.163L6.29 2.98c.329.423.445.974.315 1.494l-.547 2.19a.678.678 0 0 0 .178.643l2.457 2.457a.678.678 0 0 0 .644.178l2.189-.547a1.745 1.745 0 0 1 1.494.315l2.306 1.794c.829.645.905 1.87.163 2.611l-1.034 1.034c-.74.74-1.846 1.065-2.877.702a18.634 18.634 0 0 1-7.01-4.42 18.634 18.634 0 0 1-4.42-7.009c-.362-1.03-.037-2.137.703-2.877L1.885.511z"/>
                    </svg>
                    修改电话号码 <input type="text" class="form-control" id="modifyPhone" placeholder="请输入新电话号码">
                </div>
                <hr/>
                <button type="button" class="btn btn-primary" style="margin-left:65%;margin-bottom: 5px"
                        v-on:click="revise1">提交
                </button>
            </form>
            <!--</div>-->
        </div>
        <div v-if="permission=== 0 ">
            <!--<div id="admin-nav"></div>-->
            <div class="admin-nav"></div>
        </div>
        <div v-else-if="permission=== 1">
            <div class="person-nav"></div>
        </div>

        <!--====== 从这里结束 ======-->
    </div> <!-- container -->

</section>
<!--====== 自定义代码结束 ======-->


<!-- 导入页脚 -->
<div class="footer"></div>
<!--导入所有js文件-->
<!--====== Jquery js ======-->
<script src="assets/js/vendor/jquery-1.12.4.min.js"></script>
<script src="assets/js/vendor/modernizr-3.7.1.min.js"></script>
<!--====== Bootstrap js ======-->
<script src="assets/js/popper.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<!--====== Slick js ======-->
<script src="assets/js/slick.min.js"></script>
<!--====== Magnific Popup js ======-->
<script src="assets/js/jquery.magnific-popup.min.js"></script>
<!--====== Ajax Contact js ======-->
<script src="assets/js/ajax-contact.js"></script>
<!--====== Isotope js ======-->
<script src="assets/js/imagesloaded.pkgd.min.js"></script>
<script src="assets/js/isotope.pkgd.min.js"></script>
<!--====== Scrolling Nav js ======-->
<script src="assets/js/jquery.easing.min.js"></script>
<script src="assets/js/scrolling-nav.js"></script>
<!--====== Main js ======-->
<script src="assets/js/main.js"></script>
<!--======vue js ======-->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<!--======HttpUtil js ======-->
<script src="assets/js/util/HttpUtil.js"></script>
<script src="assets/js/util/HttpEmpty.js"></script>
</body>
</html>
<script type="text/javascript">
    //在js中引入页眉页脚
    $(document).ready(function () {
        $('.header').load('header.html');
        $('.footer').load('footer.html');
    });

    var userName = null;
    var vm = new Vue({
        el: '#div_vue',
        data: {
            //User: "",
            permission: "",
        },
        methods: {
            updatePassword: function () {
                console.log("qqqqqq=====");
                let newpassWord = $("#newPassword").val();
                let newpassWord1 = $("#passwordAgain").val();
                let params = {newpassWord: newpassWord, newpassWord1: newpassWord1};
                let url = "modify.do";
                if (checkEmpty(newpassWord)) {
                    alert("请输入新密码");
                    return;
                }
                if (checkEmpty(newpassWord1)) {
                    alert("确认输入新密码");
                    return;
                }
                if (newpassWord != newpassWord1) {
                    alert("两次密码不一致,请确认一致");
                    return;
                }
                console.log(userName);
                console.log(newpassWord);
                console.log(newpassWord1);
                postWithoutJson(url, params, function (resp) {
                    if (resp != 0) {
                        alert("恭喜您，密码修改成功，请重新登陆!");
                        location.href = "http://localhost:8080/blog_view/login.html";
                    }
                    console.log(resp);
                });
            },
            revise1: function () {
                let newEmail = $("#modifyEmail").val();
                let newPhone = $("#modifyPhone").val();
                let params = {newEmail: newEmail, newPhone: newPhone};
                let url = "personalMessage.do";
                let reg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
                if (userName == null || userName == undefined) {
                    alert("未登陆,请前往登陆");
                    location.href = "http://localhost:8080/blog_view/login.html";
                    return;
                }
                if (checkEmpty(newEmail) && checkEmpty(newPhone)) {
                    alert("请输入修改信息");
                    return;
                }
                if (!checkEmpty(newEmail)) {
                    if (!reg.test(newEmail)) {
                        alert("邮箱格式不对，请重新输入");
                        return;
                    }
                }
                console.log(newEmail);
                console.log(newPhone);
                postWithoutJson(url, params, function (resp) {
                    if (resp != 0) {
                        alert("恭喜您，修改成功个人资料成功!");
                    }
                    console.log(resp);
                });
            },
            permissionCheck: function () {
                let url = "permissionsCheck.do";
                let thisObj = this;
                doGet(url, function (resp) {
                    thisObj.permission = resp;
                    console.log('resp', resp);
                    console.log(thisObj.permission);
                })
            }
        },
        mounted: function () {
            this.permissionCheck();
            setTimeout(() => {
                console.log('per3', this.permission);
                $('.admin-nav').load('admin-nav.html');
                $('.person-nav').load('person-nav.html');
            }, 400)
        },
    });

</script>